<template>
  <div>
    <h1>点击li必须使用编程式导航</h1>
    <ul>
      <li @click="detail(1)">无人之境</li>
      <li @click="detail(2)">任我行</li>
    </ul>
    <router-view />
  </div>
</template>

<script>
export default {
  data () {
    return {

    }
  },

  created () {

  },

  methods: {
    detail (id) {
      // console.log(this.$router)
      this.$router.push('/detail/' + id)
    }
  }
}
</script>

<style scoped lang='less'>
  li {
    cursor: pointer;
  }
</style>
